import React ,{ Component } from 'react'
import ReactDom from 'react-dom'
import {BrowserRouter as Router , Route ,Redirect, Switch} from 'react-router-dom'
import Home from 'page/home/index.jsx'
import Login from 'page/login/index.jsx'
import Layout from 'component/layout/index.jsx'
import MUtil from 'util/mm.jsx'
import ErrorPage from 'page/error/index.jsx'
import UserList from 'page/user/index.jsx'
const _mm = new MUtil()

class App extends Component{
  render(){
    let LayoutRoot = (<Layout>
      <Switch>
        <Route exact path='/' component={Home}/>
        <Route  path='/product' component={Home}/>
        <Route  path='/product_category' component={Home}/>
        <Route  path='/order' component={Home}/>
        <Redirect exact from='/user' to='/user/index'/>
        <Route  path='/user/index' component={UserList}/>

        <Route  component={ErrorPage}/>
      </Switch>
    </Layout>);
    return (
      <div>
        <Router>
          <Switch>
            <Route exact path='/login' component={Login}/>
            <Route path='/' render={ props => {
              if (_mm.getStorage('userInfo')) {
                return LayoutRoot
              }else{
                return (<Redirect  to="/login"/>)
              }


            }}
            />
          </Switch>

        </Router>
      </div>
    )
  }
}

ReactDom.render(
  <App />,
  document.getElementById('app')
);